<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>tweetTask</title>
<link href="estilos/estilos.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="includes/js/jquery-1.2.6.js"></script>
<script language="javascript" type="text/javascript" src="includes/js/jquery.form.js"></script>
<script type="text/javascript" language="javascript">
function entrar(){
    if (validate()){
        var service = $('#formulario').attr("action");
        $("#mensaje").html('');
        var data = "action=login&username=" + $("#username").attr("value") + "&password="+$("#password").attr("value")+"";
        $.getJSON(service,  data, function(data){ 
            if (data.logeado)
                window.location = "index.php";
            else
                $("#mensaje").append("<ul> Datos incorrectos!!</ul>");
        });
        $("#mensaje").slideDown();
    }
}

function validate() {
    var error = "";
    var form = $('#formulario');
    var username = $('#username');
    var password = $('#password');
    if (username.attr("value")==""){
        error += "<li>Introduce el usuario</li>";
		username.focus();
	}
    
    if (password.attr("value")==""){
		error += "<li>Introduce la contraseña</li>";
		if (username.value)
			password.focus();
	}
	
    if(error.length > 0){
		$("#mensaje").html('');
		$("#mensaje").append("<ul>" + error + "</ul>");
		$("#mensaje").slideDown();
		return false;
	}
    return true;
}
</script>
</head>

<body>

<div id="bloqueLogin">
  <form id="formulario" name="formulario" method="post" action="services.php">
        <h1>Login de usuario</h1>
      <div id="mensaje"></div>
    <label for="usuario">Login
            <span class="small">Introduce tu login</span>
   	</label>
        <input type="text" name="username" id="username" />
    
        <label for="password">Password
            <span class="small">Introduce tu password</span>
        </label>
        <input type="password" name="password" id="password" />
        <button type="button" onclick="entrar();">Entrar!</button>
		<input type="hidden" name="accion" id="accion" value="login"  />
	</form>
</div>
</body>
</html>
